<template>
    <div class="com-container">
        <div class="header">
            <h1 class="title">风控系统版本质检工具</h1>
        </div>
        <div class="operate bgc">
            <div class="operate-1">
                <CheckPieChart :data="processData"></CheckPieChart>
            </div>
            <el-divider direction="vertical"></el-divider>
            <div style="margin: auto">
                <el-checkbox-group
                    v-model="checkedKeys"
                    size="mini"
                    class="checkbox-content"
                    :disabled="computedStartCheckDisabled"
                    @change="handleCheckedChange"
                >
                    <el-checkbox v-for="(value, key) in checkProjects" :key="key" :label="key"> {{ value }}</el-checkbox>
                </el-checkbox-group>
            </div>

            <el-divider direction="vertical"></el-divider>
            <div class="operate-3">
                <el-radio-group v-model="connectivity" :class="connectivity == 0 ? 'connect-s' : 'off-s'" disabled>
                    <el-radio :label="0">已连接服务</el-radio>
                    <el-radio :label="1">未连接服务</el-radio>
                </el-radio-group>
                <el-button
                    type="primary"
                    size="medium"
                    style="width: 210px"
                    v-preventReClick
                    @click="handleStartCheck"
                    :disabled="computedStartCheckDisabled"
                    >开始检测</el-button
                >
                <span v-html="checkMessage"></span>
            </div>
        </div>
        <div class="show-content">
            <el-collapse v-model="activeNames" @change="handleCollapseChange">
                <el-collapse-item v-for="(item, key) in checkData" :name="key" :key="key" :class="item.result + '-item'">
                    <template slot="title">
                        <div class="title-item">
                            <div class="title-item-left">
                                <i :class="showIcon(item.result)" class="title-icon"></i>
                                <span>
                                    {{ item.label }}
                                </span>
                                <span v-html="showResult(item.result, true)" style="margin-left: 20px"></span>
                            </div>
                            <el-button
                                size="mini"
                                style="padding: 6px"
                                v-show="['fail', 'success'].includes(item.result)"
                                @click.stop.prevent="handleReExecute(item.name)"
                                v-preventReClick
                            >
                                <i class="el-icon-refresh"></i>重新执行</el-button
                            >
                        </div>
                    </template>

                    <div v-if="item.result" class="result">
                        检测结果:<span v-html="showResult(item.result, false)" style="margin: 0 40px 0 10px"></span> 耗时:<span
                            style="margin-left: 10px"
                            >{{ item.totalTime || '--' }}秒</span
                        >
                        <br />
                        <span v-if="item.result == 'fail'" style="white-space: pre-line; color: #b60303">
                            <span v-show="item.resultData.length">
                                {{ item.resultData || '' }}
                            </span>

                            <!-- {{ 'SP_9904_IMPORT 编译出错\n' + 'SP_9904_TB_FUND_EXTRA_05 编译出错\n SP_9904_TI_DEPOSIT_05 编译出错' }}
                            {{ 'SP_9904_IMPORT 编译出错\n' + 'SP_9904_TB_FUND_EXTRA_05 编译出错\n SP_9904_TI_DEPOSIT_05 编译出错' }}
                            {{ 'SP_9904_IMPORT 编译出错\n' + 'SP_9904_TB_FUND_EXTRA_05 编译出错\n SP_9904_TI_DEPOSIT_05 编译出错' }} -->
                        </span>
                    </div>
                </el-collapse-item>
            </el-collapse>
        </div>
    </div>
</template>
<script lang="ts">
import { getConfigItem, timeFormat } from '@/utils/tools';
import { getUser } from '@/utils/user-util';
// eslint-disable-next-line camelcase
// import { this.yh_message_error } from '@yhfin/biz/components/yh-message';
import axios from 'axios';
import moment from 'moment';
import { Component, Vue, Watch } from 'vue-property-decorator';
import CheckPieChart from './check-pie-chart.vue';

@Component({ name: 'VersionQualityCheck', components: { CheckPieChart } })
export default class VersionQualityCheck extends Vue {
    checkedKeys: any = ['auto-test-vue', 'auto-test-apifox', 'auto-test-interface', 'autoUnitCheckDBScript', 'autoUnitCheckData'];
    connectivity: any = 0; // 服务连接状态
    checkResult: string = ''; // 检测最终结果
    startCheckDisabled: boolean = false; // 是否开始检测
    activeNames = ['features', 'testExamples', 'interfaces', 'indicators', 'scripts'];
    // checkProjects: any = {
    //     '1': '页面功能集成自动化检测',
    //     '2': '测试用例自动化检测',
    //     '3': '业务功能接口自动化检测',
    //     '4': '风控指标算法自动化检测',
    //     '5': '数据库脚本质量自动化检测',
    // };
    checkProjects: any = {
        'auto-test-vue': '页面功能集成自动化检测',
        'auto-test-apifox': '测试用例自动化检测',
        'auto-test-interface': '业务功能接口自动化检测',
        autoUnitCheckDBScript: '数据库脚本质量自动化检测',
        autoUnitCheckData: '风控指标算法自动化检测',
    };
    checkData: any = {
        autoTestVue: {
            name: 'auto-test-vue',
            label: '页面功能集成自动化检测',
            result: '',
            resultData: [],
            startTime: '',
            totalTime: '',
        },
        autoTestApifox: {
            name: 'auto-test-apifox',
            label: '测试用例自动化检测',
            result: '',
            resultData: [],
            startTime: '',
            totalTime: '',
        },
        autoTestInterface: {
            name: 'auto-test-interface',
            label: '业务功能接口自动化检测',
            result: '',
            resultData: [],
            startTime: '',
            totalTime: '',
        },
        autoUnitCheckDBScript: {
            name: 'autoUnitCheckDBScript',
            label: '数据库脚本质量自动化检测',
            result: '',
            resultData: [],
            startTime: '',
            totalTime: '',
        },
        autoUnitCheckData: {
            name: 'autoUnitCheckData',
            label: '风控指标算法自动化检测',
            result: '',
            resultData: [],
            startTime: '',
            totalTime: '',
        },
    };
    // 饼图数据
    processData: any = {
        finished: 0,
        unfinished: 5,
    };
    // baseURL: string = 'http://192.168.64.157:9096/yhfin/risk/engine'; // 先写死
    baseURL: string = '';
    Authentication: any = '';
    autoTestVueFinished: boolean = true; // 页面功能集成自动化检测
    autoTestApifoxFinished: boolean = true; // 测试用例自动化检测
    autoTestInterfaceFinished: boolean = true; // 业务功能接口自动化检测是否完成
    unitCheckDataFinished: boolean = true; // 数据库脚本质量自动化检测是否完成
    UnitCheckDBScriptFinished: boolean = true; // 风控指标算法自动化检测是否完成

    testVueBuilding: boolean = false; // 页面功能集成自动化检测 jenkins构建状态
    testApiFoxBuilding: boolean = false; // 测试用例自动化检测 jenkins构建状态
    timer = null; // 定时器
    timer1: any = null;
    // startTime: string = '';
    testVueTiming: any = null; // 页面功能集成自动化检测耗时计时器
    testApifoxTiming: any = null; // 测试用例自动化检测耗时计时器
    testInterfaceTiming: any = null;

    mounted() {
        // const _this = this;
        // this.timer = setInterval(() => {
        //     this.processData.finished++;
        //     this.processData.unfinished--;
        //     if (this.processData.unfinished == 0) {
        //         _this.clearInter();
        //     }
        // }, 1000);
        this.Authentication = getUser().sessionId;
        let baseURL = getConfigItem('BASE_URL_API');
        this.baseURL = baseURL.replace(/web/g, 'engine').replace(/9095/g, '9096');
        // this.baseURL = baseURL.replace(/9095/g, '9096');
        console.error(this.baseURL, 'baseUrl');
        this.getConnectState();
    }

    @Watch('checkData', { immediate: true, deep: true })
    changeCheckResult() {
        this.handleJudgsExeResult();
        // this.startCheckDisabled = false;
    }

    // 本次检测信息
    get checkMessage() {
        if (this.checkResult == 'fail') {
            return `<span style="color: red;font-weight: bolder;" class="fail">检测已完成，有问题请尽快处理!</span>`;
        } else if (this.checkResult == 'success') {
            return `<span class="success">检测已完成，版本质量真棒！</span>`;
        }
        // else if (this.checkResult == 'going') {
        //     return `<span class="success">检测中，请稍等。。。</span>`;
        // }
    }

    /**
     * 判断执行结果
     */
    handleJudgsExeResult() {
        let resultData: any[] = [];
        for (const key in this.checkData) {
            resultData.push(this.checkData[key].result);
        }
        if (resultData.includes('going')) {
            this.checkResult = 'going';
        } else if (resultData.includes('fail')) {
            this.checkResult = 'fail';
            // this.processData = {
            //     finished: this.checkedKeys.length,
            //     unfinished: 0,
            // };
        } else if (!resultData.includes('')) {
            this.checkResult = 'success';
            // this.processData = {
            //     finished: this.checkedKeys.length,
            //     unfinished: 0,
            // };
        }
    }

    // 获取服务连接状态
    async getConnectState() {
        this.connectivity = 1;
        this.startCheckDisabled = true;
        // /serverConnect/isStart
        await axios({
            method: 'get',
            url: '/serverConnect/isStart',
            baseURL: this.baseURL,
            headers: { Authentication: this.Authentication },
        })
            .then(res => {
                if (res.data.success) {
                    this.connectivity = 0;
                    this.startCheckDisabled = false;
                }
            })
            .catch(err => {
                this.yh_message_error('ERROR：' + err.message);
            });
    }

    // 展示图标
    showIcon(result: string) {
        if (result == 'success') {
            return 'el-icon-success';
        } else if (result == 'fail') {
            return 'el-icon-error';
        } else if (result == 'going') {
            return 'el-icon-loading';
        } else {
            return 'el-icon-remove';
        }
    }

    // 显示结果
    showResult(result: string, isEllipsis: boolean) {
        if (result == 'success') {
            return `<span style="color: #70b603;font-weight: bolder;">通过</span>`;
        } else if (result == 'fail') {
            return `<span style="color: #b60303;font-weight: bolder;">失败</span>`;
        } else if (result == 'going') {
            const value = '检测中' + (isEllipsis ? '...' : '');
            return `<span style="color: #380cee;font-weight: bolder;">${value}</span>`;
        } else {
            return;
        }
    }

    clearInter() {
        clearInterval(this.timer);
        this.timer = null;
    }

    // 折叠面板点击事件
    handleCollapseChange(val) {
        // console.log(val, 'handleCollapseChange------');
    }

    handleCheckedChange() {
        // console.log(this.checkedKeys, 'checkedKeys');
    }

    get computedStartCheckDisabled() {
        if (this.connectivity == '0') {
            // 当所有模块完成检测时，开始检测按钮可点击；
            if (
                this.autoTestVueFinished &&
                this.autoTestApifoxFinished &&
                this.autoTestInterfaceFinished &&
                this.unitCheckDataFinished &&
                this.UnitCheckDBScriptFinished
            ) {
                this.startCheckDisabled = false;
            } else {
                this.startCheckDisabled = true;
            }
        } else {
            this.startCheckDisabled = true;
        }
        return this.startCheckDisabled;
    }

    // 开始检测
    async handleStartCheck() {
        this.processData = {
            finished: 0,
            unfinished: this.checkedKeys.length,
        };
        for (const key in this.checkData) {
            this.checkData[key].result = '';
        }
        if (this.checkedKeys.includes('auto-test-vue')) {
            this.handleExecuteJekins('auto-test-vue', true);
        }
        if (this.checkedKeys.includes('auto-test-apifox')) {
            this.handleExecuteJekins('auto-test-apifox', true);
        }
        if (this.checkedKeys.includes('auto-test-interface')) {
            this.handleAutoTestInterface(true);
        }
        if (this.checkedKeys.includes('autoUnitCheckDBScript')) {
            this.handleAutoUnitCheckDBScript(true);
        }
        if (this.checkedKeys.includes('autoUnitCheckData')) {
            this.handleAutoUnitCheckData(true);
        }
    }

    // 执行jenkins自动化
    handleExecuteJekins(name: string, refreshProcess: boolean) {
        axios({
            method: 'get',
            url: '/jenkins/Job/execute/' + name,
            baseURL: this.baseURL,
            headers: { Authentication: this.Authentication },
        })
            .then(res => {
                // 开始执行时间
                // this.checkData[name]?.startTime = moment().format('HH:mm:ss');
                // 设置定时器，动态显示耗时，直到执行结束
                if (name == 'auto-test-vue') {
                    this.checkData['autoTestVue'].startTime = moment().format('HH:mm:ss');
                    this.checkData['autoTestVue'].result = 'going';
                    this.autoTestVueFinished = false;
                    // clearInterval(this.testVueTiming);
                    this.testVueTiming = setInterval(() => {
                        let nowTime = moment().format('HH:mm:ss');
                        this.checkData['autoTestVue'].totalTime = this.$moment(nowTime, 'hh:mm:ss').diff(
                            this.$moment(this.checkData['autoTestVue']?.startTime, 'hh:mm:ss'),
                            'seconds'
                        );
                    }, 1000);
                } else {
                    this.checkData['autoTestApifox'].startTime = moment().format('HH:mm:ss');
                    this.checkData['autoTestApifox'].result = 'going';
                    this.autoTestApifoxFinished = false;
                    // clearInterval(this.testApifoxTiming);
                    this.testApifoxTiming = setInterval(() => {
                        let nowTime = moment().format('HH:mm:ss');
                        this.checkData['autoTestApifox'].totalTime = this.$moment(nowTime, 'hh:mm:ss').diff(
                            this.$moment(this.checkData['autoTestApifox']?.startTime, 'hh:mm:ss'),
                            'seconds'
                        );
                    }, 1000);
                }
                // 执行接口调用成功，调用状态查询接口直至构建结束
                if (res.data?.returnCode === '000000') {
                    if (name == 'auto-test-vue') {
                        // 定时查询执行状态，直至本次执行结束
                        clearInterval(this.timer);
                        this.timer = setInterval(() => {
                            this.queryTestVueExecuteState(name);
                        }, 10000);
                    } else {
                        clearInterval(this.timer1);
                        this.timer1 = setInterval(() => {
                            this.queryTestApiExecuteState(name);
                        }, 10000);
                    }
                } else {
                    this.yh_message_error(res.data?.returnMsg);
                    this.handleResetExecuteState(name, 'fail');
                }
            })
            .catch(error => {
                this.yh_message_error('ERROR：' + error.message);
                this.handleResetExecuteState(name, '');
            });
    }

    /**
     * 设置jenkins自动化执行检测状态
     * @param state
     */
    handleResetExecuteState(name: string, state: string) {
        if (name == 'auto-test-vue') {
            this.autoTestVueFinished = true;
            this.checkData['autoTestVue'].result = state;
        } else {
            this.autoTestApifoxFinished = true;
            this.checkData['autoTestApifox'].result = state;
        }
    }

    /**
     * 查询页面功能集成自动化检测状态
     */
    queryTestVueExecuteState(name: string) {
        let state;
        axios({
            method: 'get',
            url: '/jenkins/Job/queryBuildInfo/' + name,
            baseURL: this.baseURL,
            headers: { Authentication: this.Authentication },
        })
            .then(res => {
                if (res.data.returnCode === '000000') {
                    state = res.data?.success;
                    if (state) {
                        if (res.data?.data) {
                            // building 构建状态； true - 构建中；false - 构建结束
                            if (res.data.data?.building) {
                                this.checkData['autoTestVue'].result = 'going';
                                // this.autoTestVueFinished = false;
                            } else {
                                // result构建结果，如果在构建中该字段返回null，FAILURE - 构建失败；SUCCESS - 构建成功
                                if (res.data.data?.result == 'SUCCESS') {
                                    this.checkData['autoTestVue'].result = 'success';
                                } else {
                                    this.checkData['autoTestVue'].result = 'fail';
                                }
                                // 清除状态查询定时器
                                clearInterval(this.timer);
                                // 清除耗时计时定时器
                                clearInterval(this.testVueTiming);
                                this.autoTestVueFinished = true;
                                // 刷新饼图进度
                                this.processData.finished++;
                                this.processData.unfinished--;
                            }
                        }
                    } else {
                        this.checkData['autoTestVue'].result = 'fail';
                        this.autoTestVueFinished = true;
                        // 刷新饼图进度
                        this.processData.finished++;
                        this.processData.unfinished--;
                    }
                } else {
                    this.yh_message_error(res.data.returnMsg);
                    this.handleResetExecuteState(name, 'fail');
                    clearInterval(this.timer);
                    // 清除耗时计时定时器
                    clearInterval(this.testVueTiming);
                    this.autoTestVueFinished = true;
                    // 刷新饼图进度
                    this.processData.finished++;
                    this.processData.unfinished--;
                }
                let nowTime = moment().format('HH:mm:ss');
                // 执行结束获取实际耗时
                this.checkData['autoTestVue'].totalTime = this.$moment(nowTime, 'hh:mm:ss').diff(
                    this.$moment(this.checkData['autoTestVue']?.startTime, 'hh:mm:ss'),
                    'seconds'
                );
            })
            .catch(error => {
                this.yh_message_error('ERROR：' + error.message);
                this.handleResetExecuteState(name, 'fail');
                clearInterval(this.timer);
                this.autoTestVueFinished = true;
                // 刷新饼图进度
                this.processData.finished++;
                this.processData.unfinished--;
                let nowTime = moment().format('HH:mm:ss');
                // 查询状态接口失败也获取实际耗时
                // this.checkData['autoTestVue'].totalTime = this.$moment(nowTime, 'hh:mm:ss').diff(
                //     this.$moment(this.checkData['autoTestVue'].startTime, 'hh:mm:ss'),
                //     'seconds'
                // );
                // 清除计时定时器
                clearInterval(this.testVueTiming);
                // 清除耗时计时定时器
                clearInterval(this.testVueTiming);
            });
    }

    /**
     * 查询测试用例自动化检测状态
     */
    queryTestApiExecuteState(name: string) {
        this.autoTestApifoxFinished = false;
        let state;
        axios({
            method: 'get',
            url: '/jenkins/Job/queryBuildInfo/' + name + '?password=115a035c57332024437c7f2eb21579d7a9&username=uat',
            baseURL: this.baseURL,
            headers: { Authentication: this.Authentication },
        })
            .then(res => {
                if (res.data.returnCode === '000000') {
                    state = res.data?.success;
                    if (state) {
                        if (res.data?.data) {
                            // building 构建状态； true - 构建中；false - 构建结束
                            if (res.data.data?.building) {
                                this.checkData['autoTestApifox'].result = 'going';
                                // this.autoTestApifoxFinished = false;
                            } else {
                                // result构建结果，如果在构建中该字段返回null，FAILURE - 构建失败；SUCCESS - 构建成功
                                if (res.data.data?.result == 'SUCCESS') {
                                    this.checkData['autoTestApifox'].result = 'success';
                                } else {
                                    this.checkData['autoTestApifox'].result = 'fail';
                                }
                                clearInterval(this.timer1);
                                clearInterval(this.testApifoxTiming);
                                this.autoTestApifoxFinished = true;
                                // 刷新饼图进度
                                this.processData.finished++;
                                this.processData.unfinished--;
                            }
                        }
                    } else {
                        this.checkData['autoTestApifox'].result = 'fail';
                        this.autoTestApifoxFinished = true;
                        // 刷新饼图进度
                        this.processData.finished++;
                        this.processData.unfinished--;
                    }
                } else {
                    this.yh_message_error(res.data.returnMsg);
                    this.handleResetExecuteState(name, 'fail');
                    clearInterval(this.timer1);
                    clearInterval(this.testApifoxTiming);
                    this.autoTestApifoxFinished = true;
                    // 刷新饼图进度
                    this.processData.finished++;
                    this.processData.unfinished--;
                }
                let nowTime = moment().format('HH:mm:ss');
                this.checkData['autoTestApifox'].totalTime = this.$moment(nowTime, 'hh:mm:ss').diff(
                    this.$moment(this.checkData['autoTestApifox'].startTime, 'hh:mm:ss'),
                    'seconds'
                );
            })
            .catch(error => {
                this.yh_message_error('ERROR：' + error.message);
                this.handleResetExecuteState(name, '');
                clearInterval(this.timer1);
                clearInterval(this.testApifoxTiming);
                // let nowTime = moment().format('HH:mm:ss');
                // this.checkData['autoTestApifox'].totalTime = this.$moment(nowTime, 'hh:mm:ss').diff(
                //     this.$moment(this.checkData['autoTestApifox'].startTime, 'hh:mm:ss'),
                //     'seconds'
                // );
                this.autoTestApifoxFinished = true;
                // 刷新饼图进度
                this.processData.finished++;
                this.processData.unfinished--;
            });
    }

    // 执行业务功能接口自动化检测
    async handleAutoTestInterface(refreshProcess: boolean) {
        // this.checkData['autoTestInterface'].result = 'going';
        // this.checkData['autoTestInterface'].startTime = moment().format('HH:mm:ss');
        // clearInterval(this.testInterfaceTiming);
        // this.testInterfaceTiming = setInterval(() => {
        //     let nowTime = moment().format('HH:mm:ss');
        //     this.checkData['autoTestInterface'].totalTime =
        //         this.$moment(nowTime, 'hh:mm:ss').diff(this.$moment(this.checkData['autoTestInterface']?.startTime, 'hh:mm:ss'), 'seconds');
        // }, 1000);
        let endTime;
        let startTime = window.performance.now();

        this.autoTestInterfaceFinished = false;

        await axios({
            method: 'get',
            url: '/unitest/static/enter/calculate',
            baseURL: this.baseURL,
            headers: { Authentication: this.Authentication },
        })
            .then(res => {
                this.checkData['autoTestInterface'].result = 'going';
                this.checkData['autoTestInterface'].startTime = moment().format('HH:mm:ss');
                let state = res.data?.success; // 是否执行成功
                const data = res.data?.data; // 执行不通过的数据
                if (res.data.returnCode === '000000') {
                    if (state) {
                        if (data && data.length) {
                            this.checkData['autoTestInterface'].result = 'fail';
                            this.checkData['autoTestInterface'].resultData = data;
                        } else {
                            this.checkData['autoTestInterface'].result = 'success';
                        }
                    } else {
                        this.checkData['autoTestInterface'].result = 'fail';
                    }
                } else {
                    this.yh_message_error(res.data.returnMsg);
                }
                this.autoTestInterfaceFinished = true;
                // 刷新饼图进度
                if (refreshProcess) {
                    this.processData.finished++;
                    this.processData.unfinished--;
                }
                endTime = window.performance.now(); // 获取当前时间
                this.checkData['autoTestInterface'].totalTime = ((endTime - startTime) / 1000).toFixed(3);
            })
            .catch(error => {
                this.autoTestInterfaceFinished = true;
                this.yh_message_error('ERROR：' + error.message);
                this.checkData['autoTestInterface'].result = '';
                // 刷新饼图进度
                if (refreshProcess) {
                    this.processData.finished++;
                    this.processData.unfinished--;
                }
            });
    }

    // 执行风控指标算法自动化检测
    handleAutoUnitCheckDBScript(refreshProcess: boolean) {
        // this.checkData['autoUnitCheckDBScript'].result = 'going';
        let endTime;
        let startTime = window.performance.now();
        // this.checkData['autoUnitCheckDBScript'].startTime = moment().format('HH:mm:ss'); // 获取当前时间
        this.UnitCheckDBScriptFinished = false;
        axios({
            method: 'post',
            url: '/unitest/auto/dataAutoTest/autoUnitCheckDBScript',
            baseURL: this.baseURL,
            headers: { Authentication: this.Authentication },
        })
            .then(res => {
                this.checkData['autoUnitCheckDBScript'].result = 'going';
                const data = res.data?.data;
                let state = res.data?.success;
                if (res.data.returnCode === '000000') {
                    if (state) {
                        if (data && data.length) {
                            this.checkData['autoUnitCheckDBScript'].result = 'fail';
                            this.checkData['autoUnitCheckDBScript'].resultData = data;
                        } else {
                            this.checkData['autoUnitCheckDBScript'].result = 'success';
                        }
                    } else {
                        this.checkData['autoUnitCheckDBScript'].result = 'fail';
                    }
                } else {
                    this.yh_message_error(res.data.returnMsg);
                }
                this.UnitCheckDBScriptFinished = true;
                if (refreshProcess) {
                    this.processData.finished++;
                    this.processData.unfinished--;
                }
                endTime = window.performance.now(); // 获取当前时间
                this.checkData['autoUnitCheckDBScript'].totalTime = ((endTime - startTime) / 1000).toFixed(3);
                console.log(this.checkData['autoUnitCheckDBScript'].totalTime);
            })
            .catch(error => {
                this.UnitCheckDBScriptFinished = true;
                this.yh_message_error('ERROR：' + error.message);
                this.checkData['autoUnitCheckDBScript'].result = '';
            });
    }

    // 执行数据库脚本质量自动化检测
    handleAutoUnitCheckData(refreshProcess: boolean) {
        // this.checkData['autoUnitCheckData'].result = 'going';
        let endTime;
        let startTime = window.performance.now();
        this.unitCheckDataFinished = false;
        axios({
            method: 'post',
            url: '/unitest/auto/dataAutoTest/autoUnitCheckData',
            baseURL: this.baseURL,
            headers: { Authentication: this.Authentication },
        })
            .then(res => {
                this.checkData['autoUnitCheckData'].result = 'going';
                const data = res.data?.data;
                let state = res.data?.success;
                if (res.data.returnCode === '000000') {
                    if (state) {
                        if (data && data.length) {
                            this.checkData['autoUnitCheckData'].result = 'fail';
                            this.checkData['autoUnitCheckData'].resultData = data;
                        } else {
                            this.checkData['autoUnitCheckData'].result = 'success';
                        }
                    } else {
                        this.checkData['autoUnitCheckData'].result = 'fail';
                    }
                } else {
                    this.yh_message_error(res.data.returnMsg);
                }
                this.unitCheckDataFinished = true;
                // 刷新饼图进度
                if (refreshProcess) {
                    this.processData.finished++;
                    this.processData.unfinished--;
                }
                endTime = window.performance.now(); // 获取当前时间
                this.checkData['autoUnitCheckData'].totalTime = ((endTime - startTime) / 1000).toFixed(3);
            })
            .catch(error => {
                this.unitCheckDataFinished = true;
                this.yh_message_error('ERROR：' + error.message);
                this.checkData['autoUnitCheckData'].result = '';
                // 刷新饼图进度
                if (refreshProcess) {
                    this.processData.finished++;
                    this.processData.unfinished--;
                }
            });
    }

    /**
     * 重新执行
     * @param name 测试模块名称
     */
    handleReExecute(name: string) {
        if (!['auto-test-vue', 'auto-test-apifox', 'auto-test-interface'].includes(name)) {
            this.checkData[name].result = 'going';
        }
        if (name == 'auto-test-vue') {
            this.checkData['autoTestVue'].result = 'going';
            this.handleExecuteJekins(name, false);
        } else if (name == 'auto-test-apifox') {
            this.checkData['autoTestApifox'].result = 'going';
            this.handleExecuteJekins(name, false);
        } else if (name == 'auto-test-interface') {
            this.checkData['autoTestInterface'].result = 'going';
            this.handleAutoTestInterface(false);
        } else if (name == 'autoUnitCheckDBScript') {
            this.handleAutoUnitCheckDBScript(false);
        } else if (name == 'autoUnitCheckData') {
            this.handleAutoUnitCheckData(false);
        }
    }

    beforeDestroy() {
        if (this.timer) {
            this.timer && clearInterval(this.timer);
            this.timer = null;
        }
        if (this.timer1) {
            this.timer1 && clearInterval(this.timer1);
            this.timer1 = null;
        }
        if (this.testVueTiming) {
            this.testVueTiming && clearInterval(this.testVueTiming);
            this.testVueTiming = null;
        }

        if (this.testApifoxTiming) {
            this.testApifoxTiming && clearInterval(this.testApifoxTiming);
            this.testApifoxTiming = null;
        }
    }
}
</script>
<style lang="scss" scoped>
.com-container {
    width: 100%;
    height: 100%;
    min-width: 1050px;
    min-height: 400px;
    .header {
        width: 100%;
        height: 60px;
        background-image: url('../risk-monitoring/images/title.png');
        background-size: 100%;
        background-color: #fff;
        .title {
            font-size: 24px;
            font-weight: 600;
            color: #107fff;
            line-height: 33px;
            letter-spacing: 20px;
            text-align: center;
            height: 100%;
            line-height: 60px;
        }
    }
    .bgc {
        background-color: #f0faff;
        border: 1px solid #ccc;
        margin: 10px;
    }
    // .operate::before {
    //     content: '';
    //     position: absolute;
    //     top: 0;
    //     z-index: 0;
    //     height: 100%;
    //     width: 100%;
    //     background: url(./assets/border01.png) no-repeat;
    //     background-size: 100% 100%;
    //     filter: hue-rotate(217deg);
    // }

    .operate {
        height: 30%;
        width: calc(100% - 20px);
        display: flex;
        margin: 10px;
        .operate-1 {
            height: 100%;
            width: 30%;
        }
        .checkbox-content {
            width: 35%;
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 25px 20px;
            margin: auto;
            justify-content: center;
            padding-left: 30px;
            // width: 18%;
            // display: flex;
            // gap: 15px;
            // justify-content: end;
            // flex-direction: row;

            // margin: auto;
            // width: 40%;
            // display: flex;
            // gap: 0px;
            // /* align-items: center; */
            // /* justify-content: center; */
            // flex-direction: row;
            // flex-wrap: wrap;
        }
        .operate-3 {
            // flex: 1;
            width: 30%;
            display: flex;
            gap: 20px;
            justify-content: center;
            align-items: center;
            flex-direction: column;
        }
    }
    .show-content {
        margin: 10px;
        height: calc(70% - 80px);
        overflow: auto;
        border: 1px solid #ccc;

        .title-item {
            width: 95%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            .title-item-left {
                display: flex;
                align-items: center;
                .title-icon {
                    margin: 0 6px;
                    font-size: 20px;
                }
            }
        }
    }
}
.result {
    height: fit-content;
    max-height: 250px;
    overflow: auto;
}
/deep/ .el-checkbox__input.is-checked + .el-checkbox__label {
    color: #575757 !important;
}
.connect-s {
    /deep/.el-radio:first-child .el-radio__input + .el-radio__label {
        color: #70b603 !important;
        font-weight: bolder;
    }
}

.off-s {
    /deep/.el-radio:last-child .el-radio__input + .el-radio__label {
        color: #b60303 !important;
        font-weight: bolder;
    }
}
.success-item {
    /deep/ .el-collapse-item__header {
        background-color: #cfeaa6;
        border-bottom: 1px solid #ccc;
    }
}

.fail-item {
    /deep/ .el-collapse-item__header {
        background-color: rgb(224, 162, 162);
        border-bottom: 1px solid #ccc;
    }
}

.going-item {
    /deep/ .el-collapse-item__header {
        background: linear-gradient(to right, #b1cce7, #5daaf6, #abc1d4, #5daaf6);
        background-size: 400% 200%;
        animation: gradientBG 2s ease infinite;
        border-bottom: 1px solid #ccc;
    }
}

/* 动画，控制背景 background-position */
@keyframes gradientBG {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 50% 100%;
    }
    100% {
        background-position: 0% 50%;
    }
    // 0% {
    //     transform: scale(1);
    // }
    // 50% {
    //     transform: scale(0.5);
    // }
    // 100% {
    //     transform: scale(1);
    // }
}

/deep/ .el-collapse-item__header {
    background-color: #f2f2f2;
    border-bottom: 1px solid #ccc;
}
/deep/ .el-collapse-item__content {
    padding: 10px;
}
.el-icon-error {
    color: #b60303;
}
.el-icon-success {
    color: #70b603;
}
.el-icon-loading {
    color: #409eff;
}

.el-icon-refresh {
    margin: 0 6px;
    font-size: 12px;
}

.success {
    color: #70b603;
    font-weight: bolder;
}
.fail {
    color: #b60303;
    font-weight: bolder;
}
/deep/ .el-divider--vertical {
    width: 3px;
    border-radius: 100%;
    height: 100%;
    // margin: 0 40px !important;
    background-image: linear-gradient(to bottom, #d7e4ff, #ddeeff, #d7e4ff);
}
</style>
